feat(ocm): implement WAYF page and enhance invitation workflow #13243
+1,297
−66
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.


Although this PR is referenced under cs3org/OCM-STA#1, it is not directly part of the STA funded work. However, since the changes are closely related and beneficial to OCM, I decided to port them here as well for consistency.
This PR depends on this PR owncloud/reva#432 to be merged in Reva.
This PR depends on this PR owncloud/ocis#11758 to be merged in oCIS.
Description
This PR implements the frontend components for WAYF (Where Are You From) functionality in the OCM web application, enabling users to discover and select their cloud provider when accepting federated invitations. The implementation provides a user friendly interface for OCM provider selection and complements the backend WAYF discovery endpoints.
Technical
Things I've added to the web application:
Code Changes
New Components:
src/views/Wayf.vue: Main WAYF page with provider selection UI, search functionality, and federation displaysrc/views/InvitationAcceptanceModal.vue: Modal component for accepting invitations with provider validationNew Composables:
src/composables/useWayf.ts: Core WAYF logic including federation loading, provider discovery, and self-domain validationsrc/composables/useInvitationAcceptance.ts: Shared invitation acceptance logic with self-generated token detectionNew Types:
src/types/wayf.ts: TypeScript interfaces for federation and provider data structuresUpdated Routing (
src/index.ts):/wayfroute withauthContext: 'anonymous'for public access/accept-inviteroute for invitation acceptance workflowModified Views:
src/views/OutgoingInvitations.vue: Added three token copy options (plain, base64, WAYF link) with visual improvementssrc/views/IncomingInvitations.vue: Refactored to use shareduseInvitationAcceptancecomposablesrc/views/ConnectionsPanel.vue: Minor UI adjustmentssrc/views/App.vue: Updated to support new routesStore Updates (
web-pkg/src/composables/piniaStores/inviteTokensList.ts):tokenAtProviderandwayfLinkpropertiesDocumentation:
docs/Where Are You From page.md: WAYF usage guide, API endpoints, and testing scenariosVideos of the changes and general flow of the OCM app
From oCIS to Nextcloud
Ocis-To-Nextcloud.webm
From Nextcloud to oCIS
Nextcloud-to-oCIS.webm